.sidebar {
    position: sticky;
    top: var(--navbar-height);
    height: calc(100vh - var(--navbar-height));
    width: var(--sidebar-width);
    background: var(--standart-el);
    transition: width 0.25s ease-in-out;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    padding: 10px;
    overflow-x: hidden;

    li {
        padding: 10px 15px;
        display: flex;
        align-items: center;
        gap: 20px;
    
        :nth-child(1) {
            width: 30px;
            height: 30px;
            fill: var(--accent-txt);
        }
    
        :nth-child(2) {
            text-decoration: none;
            width: calc(var(--sidebar-width) - var(--sidebar-width-collapsed));
            position: absolute;
            left: 80px;
            transition: opacity 0.25s ease-in-out;
        }
    }
}

.collapsed {
    width: var(--sidebar-width-collapsed);

    li {
        > :nth-child(2) {
            opacity: 0;
        }
    }
}